<template>

	<view class="padding" :style="'height:'+screenHeight+'px;'">
		<view class="boxconten" style="height: 100%;">
			<view class="one">

				<view class="" style="color: #0197F6;" v-if="item.TJStatus==1">
					<span>已预约</span>
				</view>
				<view class="" style="color: #27BF86;" v-if="item.TJStatus==2">
					<span>已完成</span>
				</view>
				<view class="" style="color: #0197F6;" v-if="item.TJStatus==11">
					<span>已接诊</span>
				</view>
				<!-- <view class="" style="color: #c0c0c0;" v-if="item.TJStatus==10">
					<span>已退款</span>
				</view> -->
			</view>
			<view class="two">
				<view style="twoicon"><u-icon name="clock" color="#878787" size="40"
						:label="'订单编号： '+item.TJRegNo"></u-icon></view>
				<view style="twoicon"><u-icon name="more-circle" color="#a1a1a1" size="40"
						:label="'就诊人： '+item.TJName"></u-icon></view>
				<view style="twoicon"><u-icon name="account" color="#a1a1a1" size="40"
						:label="'体检项目： '+item.TJTestName"></u-icon></view>
				<view style="twoicon"><u-icon name="account" color="#a1a1a1" size="40"
						:label="'费用： '+item.TJAmount"></u-icon></view>
				<view style="twoicon"><u-icon name="account" color="#a1a1a1" size="40"
						:label="'预约时间： '+splitetext(item.TJRegDatetime)"></u-icon></view>
				<view style="twoicon"><u-icon name="chat" color="#a1a1a1" size="40"
						:label="'支付时间： '+splitetext(item.TJPayDatetime)"></u-icon></view>
			</view>
			<!-- <view class="" v-if="item.TJStatus==0">
				<view class="bottom-button">
					<view class="button bacnone2" @click="this.showPay = true">支付</view>
				</view>
				<u-modal v-model="showPay" confirm-color='#0197F6' :content="content2" show-cancel-button="true"
					@confirm="ComPay()" @cancel="showPay = false" mask-close-able="true"></u-modal>
			</view> -->


			<view class="code" v-if="item.TJStatus==1">
				<!-- <canvas  style="width: 400rpx;height: 400rpx;" canvas-id="couponQrcode"></canvas> -->
				<uv-qrcode ref="qrcode" size="300rpx" :value="item.TJIDCardNo"></uv-qrcode>
				<!-- <canvas id="qrcode" canvas-id="qrcode" style="width: 200px;height: 200px;"></canvas> -->
				<!-- <view class="codetetx">
						<span>姓名：{{user.TJName}}</span>
						<span>身份证：{{user.TJIDCardNo}}</span>
					</view> -->
			</view>

			<view class="" v-if="item.TJStatus==1">
				<view class="bottom-button">
					<view class="button bacnone2" @click="cancellationshow=true">取消预约</view>
				</view>

			</view>

			<view class="" v-if="item.TJStatus==2">
				<view class="bottom-button">
					<view class="button bacnone2" @click="totijian2()">查看体检报告</view>
				</view>

			</view>
			<!-- 	<view class="" v-if="item.TJStatus==1">
				<view class="bottom-button">
					<view class="button bacnone2" @click="this.refund = true">退款</view>
				</view>
				<u-modal v-model="refund" confirm-color='#FF6F86' :content="content3" show-cancel-button="true"
					@confirm="refundpay()" @cancel="refund = false" mask-close-able="true"></u-modal>
			
			</view> -->
			<!-- 	<view class="three">
				<span>预约单号：{{item.TJRegNo}}</span>
			</view>
			<view class="qrcodes">
				<uv-qrcode ref="qrcode" size="300rpx" :value="item.TJRegNo"></uv-qrcode>
			</view>
			<view class="four">
				<view v-if="item.TJRegNo==0">
					<u-button @click="payment(item.TJRegNo)"  type="success">支付</u-button>
				</view> -->
			<!-- 	<view class="" style="background-color: #C0C0C0;" v-if="item.Status==10">
					<u-button @click="deleteshow=true" type="default">删除记录</u-button>
				</view>
				<view v-if="item.Status==2">
					<u-button @click="cancellationshow=true" type="success">取消预约</u-button>
				</view> -->

			<!-- view v-if="item.Status==20">
					<u-button type="primary">已完成</u-button>
				</view> -->
			<!-- </view> -->
		</view>
		<u-modal v-model="cancellationshow" :content="cancellationtext" @confirm="cancellation" :mask-close-able="true"
			:show-cancel-button="true"></u-modal>
		<u-modal v-model="cancellationComfirmshow" :content="cancellationComfirm" @confirm="toCancell"
			:mask-close-able="false" :show-cancel-button="false"></u-modal>
		<!-- 	<u-modal v-model="deleteshow" :content="deletetext" @confirm="deletes" :mask-close-able="true"
			:show-cancel-button="true"></u-modal> -->
	</view>
</template>

<script>
	import axios from 'axios'
	import UQRCode from 'uqrcodejs';
	import {
		mapState,
		mapGetters
	} from 'vuex'
	export default {
		data() {
			return {

				screenHeight: getApp().globalData.screenHeight - 44,
				OrderId: '',
				showPay: false,
				refund: false,
				cancellationtext: '取消预约后将无法撤回，是否取消',
				cancellationComfirm: "取消成功",
				cancellationshow: false,
				cancellationComfirmshow: false,
				deletetext: '删除记录后无法找回，是否删除',
				deleteshow: false,
				content2: '请确认支付！',
				content3: '是否退款？',
				item: {

					TJRegNo: "",
					TJName: "",
					TJTestName: "",
					TJAmount: "",
					TJRegDatetime: "",
					TJPayDatetime: "",
					TJStatus: "",
					TJIDCardNo: "",
					TJRegisterId: "",
					PDF_Url:"",


					// DoctorName: "",
					// DptId: "",
					// DptName: "",
					// Memo: "",
					// Mobile: "",
					// OrderId: "",
					// OrderNumber: "",
					// PatientName: "",
					// PayNumber: "",
					// Status: '',
					// VisitDay: "",
					// VisitTime: "",
					// GHF:0
				},



			}
		},
		onLoad(option) {
			this.item.TJRegNo = option.TJRegNo
			console.log(this.item.TJRegNo + "66666666666666666666")
			this.item.TJName = option.TJName
			this.item.TJTestName = option.TJTestName
			this.item.TJAmount = option.TJAmount
			this.item.TJRegDatetime = option.TJRegDatetime
			this.item.TJPayDatetime = option.TJPayDatetime
			this.item.TJStatus = option.TJStatus
			this.item.TJIDCardNo = option.TJIDCardNo
			this.item.TJRegisterId = option.TJRegisterId
			this.item.PDF_Url = option.PDF_Url
			//	console.log("option.OrderId", option.OrderId)
			//this.getDetail()
		},
		onShow() {
			this.totijian();
		},
		computed: {
			...mapState(['token'], ['userInfo']),
			...mapGetters(['hasLogin', 'getUserInfo'])
		},
		methods: {
			totijian() {
				// this.axios({
				//   method:'get',
				//   url:'http://123.178.150.114:9002/dcms/reslib/util/print/printView.html',
				//   params:{
				//     printcode:"CHILD_JN_ERTJCYZMHYD",
				// 	orgid:"307",
				// 	showview:"true",
				// 	pdf:"1",
				// 	checknum:this.item.TJRegNo,
				//   },
				// }).then((res)=>{
				//   console.log(res)
				// })

				// uni.request({
				// 	url: "http://123.178.150.114:9002/dcms/reslib/util/print/printView.html",
				// 	method: "get",
				// 	data: {
				// 		printcode:"CHILD_JN_ERTJCYZMHYD",
				// 			orgid:"307",
				// 			showview:"true",
				// 			pdf:"1",
				// 			checknum:this.item.TJRegNo,
				// 	},


				// 	success: res => {
				// 		console.log(
				// 			res) //{"code":200,"info":{"name":"","accid":"123456789","token":"100bb0199afe1c9d23fb16afe5e3a5f1"}}
				// 	},
				// 	fail: res => {
				// 		//错误提示框
				// 		console.log(res) //{code: 414, desc: "already register"}
				// 	}
				// })
				//				console.log(111111111111111111)

				//				console.log("UQRCode", UQRCode)

				// 获取uQRCode实例
				var qr = new UQRCode();
				// 设置二维码内容
				qr.data = this.item.TJIDCardNo;
				// 设置二维码大小，必须与canvas设置的宽高一致
				qr.size = 200;
				// 调用制作二维码方法
				qr.make();
				// 获取canvas上下文
				var canvasContext = uni.createCanvasContext('qrcode', this); // 如果是组件，this必须传入
				// 设置uQRCode实例的canvas上下文
				qr.canvasContext = canvasContext;
				// 调用绘制方法将二维码图案绘制到canvas上
				qr.drawCanvas();




			},
			totijian2() {
				open("http://hjtj.xztongyong.cn/" + this.item.PDF_Url)

			},
			showReport(item) {
					let li
				
						li = "http://hjtj.xztongyong.cn/" + this.item.PDF_Url
						
						
						if (this.isWeiXin()) {
						
						uni.showLoading({
							title: '加载中'
						})
							window.location.href = li //验证token
							ni.hideLoading()
						} else {
							uni.showLoading({
								title: '加载中'
							})
							open(li);
							uni.hideLoading()
						}
				
				},
			
			
			
				
				
		
			isWeiXin() {
				var ua = window.navigator.userAgent.toLowerCase();
				if (ua.match(/MicroMessenger/i) == 'micromessenger') {
					return true;
				} else {
					return false;
				}
			},
			refundpay() {
				console.log(this.item.TJRegNo)
				this.$request("pay", "TjRefund", {
					OrderNo: this.item.TJRegNo
				}).then(res => {
					if (res.code == 1) {
						console.log("删除成功!")

						uni.redirectTo({
							url: `/pages/MedicalExamination/Record/Record?current=${0}`,
							fail(error) {
								console.log(error)
							}
						})
					}
				})
			},


			ComPay() {



				this.$request("pay", "GetTjSignData", {
					OrderNo: this.item.TJRegNo,
				}).then(resa => {
					// console.log("订单号",resa)
					WeixinJSBridge.invoke('getBrandWCPayRequest', {
							"appId": resa.data.appId, //公众号ID，由商户传入     
							"timeStamp": resa.data.timeStamp, //时间戳，自1970年以来的秒数     
							"nonceStr": resa.data.nonceStr, //随机串     
							"package": resa.data.package,
							"signType": resa.data.signType, //微信签名方式：     
							"paySign": resa.data.paySign //微信签名 
						},
						function(res) {
							// then.sss=res
							// console.log("支付",res)
							if (res.err_msg == "get_brand_wcpay_request:ok") {
								uni.showToast({
									title: "成功支付",
									icon: "none",
									duration: 1000,
								});
								setTimeout(function() {
									uni.redirectTo({
										url: `/pages/MedicalExamination/Record/Record?current=${1}`,
										fail(error) {
											console.log(error)
										}
									})
									return
								}, 1000);

							} else {
								uni.showToast({
									title: "支付未成功",
									icon: "none",
									duration: 1000,
								});
								setTimeout(function() {
									uni.redirectTo({
										url: `/pages/MedicalExamination/Record/Record?current=${0}`,
										fail(error) {
											console.log(error)
										}
									})
									return
								}, 1000);
							}
						});
				})











				// this.$request("pay", "GetTjSignData", {
				// 		OrderNo: this.item.TJRegNo
				// }).then(resa => {
				// 	WeixinJSBridge.invoke('getBrandWCPayRequest', {
				// 			"appId": resa.data.appId, //公众号ID，由商户传入     
				// 			"timeStamp": resa.data.timeStamp, //时间戳，自1970年以来的秒数     
				// 			"nonceStr": resa.data.nonceStr, //随机串     
				// 			"package": resa.data.package,
				// 			"signType": resa.data.signType, //微信签名方式：     
				// 			"paySign": resa.data.paySign //微信签名 
				// 		},
				// 		function(res) {
				// 			// then.sss=res
				// 			// console.log("支付",res)


				// 			console.log(res)
				// 			if (res.msg == "get_brand_wcpay_request:ok") {
				// 				uni.showToast({
				// 					title: res+"66",
				// 					icon: "none",
				// 					duration: 2000,
				// 				});
				// 				setTimeout(function() {
				// 					uni.redirectTo({
				// 						url: `/pages/MedicalExamination/Record/Record?current=${2}`,
				// 						fail(error) {
				// 							console.log(error)
				// 						}
				// 					})
				// 				}, 2000);

				// 			} else {
				// 				uni.showToast({
				// 					title: res+"77",
				// 					icon: "none",
				// 					duration: 2000,
				// 				});
				// 				setTimeout(function() {
				// 					uni.redirectTo({
				// 						url: `/pages/MedicalExamination/Record/Record?current=${2}`,
				// 						fail(error) {
				// 							console.log(error)
				// 						}
				// 					})
				// 				}, 2000);
				// 			}
				// 			showPay = false;
				// 		});

				// })
			},

			getDetail() {
				uni.showLoading({
					title: '请稍后'
				})
				this.$request("Order", "Detail", {
					OrderId: this.OrderId
				}).then(res => {
					console.log("详情", res)
					if (res.code == 1) {
						this.item = res.data
						uni.hideLoading();

					} else {
						uni.hideLoading();
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 2000
						});
					}
				})
			},
			splitetext(text) {
				console.log(text)
				let temp = text + ''
				temp = Number.parseInt((temp.split("T")[0].split('-')[1])) + "月" + temp.split("T")[0].split('-')[2] + "日"
				return temp


			},
			deletes() {
				this.$request("Order", "Delete", {
					OrderNo: this.item.OrderNumber
				}).then(res => {
					if (res.code == 1) {
						console.log("res", res)
						if (res.code == 1) {
							uni.showToast({
								title: '删除成功',
								icon: 'none',
								duration: 1000
							});
							setTimeout(function() {
								uni.redirectTo({
									url: `/pages/register/Scheduling/record/record?current=${0}`,
									fail(error) {
										console.log(error)
									}
								})
								return
							}, 1000);
						}
					} else {
						uni.showToast({
							title: '删除失败',
							icon: 'none',
							duration: 1000
						});
					}
				})
			},
			// pays() {
			// 	console.log("OrderNumber", this.OrderNumber)
			// 	this.$request("pay", "pay", {
			// 		OrderNo: this.item.OrderNumber,
			// 		openid: this.item.openid,
			// 	}).then(resto => {
			// 		console.log(resto)
			// 		if (resto.code == 1) {
			// 			uni.showLoading({
			// 				title: '请等待'
			// 			})
			// 			uni.requestPayment({
			// 				provider: 'wxpay',
			// 				timeStamp: resto.data.Timestamp,
			// 				package: resto.data.Package,
			// 				nonceStr: resto.data.Noncestr,
			// 				signType: resto.data.SignType,
			// 				paySign: resto.data.paySign,
			// 				success: (resshree) => {
			// 					console.log("resshree", resshree)
			// 					uni.showToast({
			// 						title: '支付成功',
			// 						icon: 'none',
			// 						duration: 1000
			// 					});
			// 					setTimeout(function() {
			// 						uni.navigateBack()
			// 						return
			// 					}, 1000);

			// 				},
			// 				fail: (err) => {
			// 					// console.log("err",err)
			// 					uni.showToast({
			// 						title: '支付失败',
			// 						icon: 'none',
			// 						duration: 1000
			// 					});
			// 					setTimeout(function() {
			// 						uni.navigateBack()
			// 						return
			// 					}, 1000);
			// 				}

			// 			})

			// 		}

			// 	})

			// },
			// payment(OrderNumber) {
			// 	this.$request("pay", "GetTjSignData", {
			// 		OrderNo: OrderNumber,
			// 	}).then(resa => {
			// 		console.log("订单号", resa)
			// 		WeixinJSBridge.invoke('getBrandWCPayRequest', {
			// 				"appId": resa.data.appId, //公众号ID，由商户传入     
			// 				"timeStamp": resa.data.timeStamp, //时间戳，自1970年以来的秒数     
			// 				"nonceStr": resa.data.nonceStr, //随机串     
			// 				"package": resa.data.package,
			// 				"signType": resa.data.signType, //微信签名方式：     
			// 				"paySign": resa.data.paySign //微信签名 
			// 			},
			// 			function(res) {
			// 				// then.sss=res
			// 				// console.log("支付",res)
			// 				if (res.err_msg == "get_brand_wcpay_request:ok") {
			// 					uni.showToast({
			// 						title: "成功支付",
			// 						icon: "none",
			// 						duration: 1000,
			// 					});
			// 					setTimeout(function() {
			// 						uni.redirectTo({
			// 							url: `/pages/MedicalExamination/Record/Record?current=${3}`,
			// 							fail(error) {
			// 								console.log(error)
			// 							}
			// 						})
			// 						return
			// 					}, 1000);

			// 				} else {
			// 					uni.showToast({
			// 						title: "支付未成功",
			// 						icon: "none",
			// 						duration: 1000,
			// 					});
			// 					setTimeout(function() {
			// 						uni.redirectTo({
			// 							url: `/pages/MedicalExamination/Record/Record?current=${2}`,
			// 							fail(error) {
			// 								console.log(error)
			// 							}
			// 						})
			// 						return
			// 					}, 1000);
			// 				}
			// 			});
			// 	})
			// uni.login({
			//     success: async resCode => {
			// 		console.log("rescode",resCode)
			//         let res = await this.$request('auth', 'getopenid', {
			//             Code: resCode.code
			//         });

			//         if (res.code === 1) {
			// 			console.log("res",res)
			//             this.appid = res.data.appid;
			//             this.sessionkey = res.data.session_key;
			//             this.openid = res.data.openid;
			// 			if(GHF==0){
			// 				return
			// 			}else{
			// 				this.pays()
			// 			}

			//         }
			//     }
			// })
			// },
			cancellation() {
				console.log("进了")
				this.$request("RegTJRecord", "DelOrder", {
					TJRegisterId: this.item.TJRegisterId
				}).then(res => {
					console.log("res", res)
					if (res.code == 1) {

						this.cancellationComfirm = "取消成功"
						this.cancellationComfirmshow = true

					} else {
						this.cancellationComfirm = "取消失败"
						this.cancellationComfirmshow = true
					}
				})
			},
			formattedDatemonth(VisitDay) {
				const date = new Date(VisitDay);
				return date.toLocaleDateString('zh-CN', {
					month: 'short'
				}).replace(/\//g, '月');
			},
			formattedDateday(VisitDay) {
				const date = new Date(VisitDay);
				return date.toLocaleDateString('zh-CN', {
					day: 'numeric'
				}).replace(/\//g, '月');
			},
			toCancell() {

				uni.redirectTo({
					url: `/pages/MedicalExamination/Record/Record?current=${0}`,
					fail(error) {
						console.log(error)
					}
				})
				this.cancellationComfirmshow = false
			}
		}
	}
</script>

<style>
	@import './Record.css'
</style>